function Class_IDService(){
	this._symbolMap={
		"S001":"S&P 500",
		"S002":"Oil",
		"S003":"Gold"
	};
}

Class_IDService.prototype={
	getSymbolByID:function(tickerID){
		return this._symbolMap[tickerID];
	}
}

//global IDService
var IDService=new Class_IDService();

		
function Widget(containerID,dataUrl,interval)
{
	this.$container=$("#"+containerID);
	this.dataUrl=dataUrl;
	this.interval=interval;
	
	this.mainHTML=
		'<div class="practice">'+
		'<div class="head">'+
			'<span class="button">Refresh</span>'+
			'<span class="check"><input type="checkbox" />auto refresh</span>'+
		'</div>'+//end "head"
		'<div class="body">'+
			'<table class="tickerTable">'+
					'<tr>'+
						'<th>Ticker</th>'+
						'<th>LastPrice</th>'+
						'<th>Chg</th>'+
						'<th>Chg%</th>'+
					'</tr>'+
			'</table>'+
		'</div>'+//end "body"
	'</div>';//end "practice"
	
	this.trHTML=
		'<tr class="ticker">'+
		'<td class="symbol"></td>'+
		'<td class="lastPrice"></td>'+
		'<td class="chg"></td>'+
		'<td class="chgPer"></td>'+
	'</tr>'+
	'<tr class="toggle">'+
		'<td colspan="4"><img src="img/ticker.png"/></td>'+
	'</tr>';
	
	this.createDOM();
}

Widget.prototype={

	createDOM:function(){
		var self=this;
		this.$container.html(this.mainHTML);
		this.$container.find(".button").bind("click",function(){self.loadData();});
		this.$container.find(".check input").bind("click",function(){self.autoRefresh($(this));});
	},
	
	acceptTicker:function(aTickerIDs){
		
		var $table=this.$container.find(".tickerTable");
		$table.find("tr:gt(0)").html("");
		for(var i in aTickerIDs){
			var symbol=IDService.getSymbolByID(aTickerIDs[i]);
			if(symbol){
				//it is a valid ticker ID
				var self=this;
				var $tr=$(this.trHTML);
				$tr.eq(0).bind("click",function(){self.togglePic($(this));});
				$tr.eq(0).data("tickerID",aTickerIDs[i]);
				$tr.find(".symbol").text(symbol);
				$tr.appendTo($table);
			}
		}
		
		this.loadData();
	},
	
	loadData:function(){
		var self=this;
		$.get(this.dataUrl,null,function(text){self.updateData(text);});
/*		this.updateData(
			'{'+
				'"S001":{"lastPrice":"231.88","chg":"+23.55","chgPer":"+3.56%"},'+
				'"S002":{"lastPrice":"534.23","chg":"+11.90","chgPer":"+2.23%"},'+
				'"S003":{"lastPrice":"582.45","chg":"-12.21","chgPer":"-4.41%"}'+
			'}'
		);*/
	},
	
	updateData:function(responseText){
		var self=this;

		var jsonData=JSON.parse(responseText);
		
		this.$container.find(".ticker").each(function(){
			var rowData=jsonData[$(this).data("tickerID")];
			if(rowData){
				//update row
				self.updateRow($(this),rowData);
			}
		})
		
	},
	
	updateRow:function($row,rowData){

		$row.find(".lastPrice").text(rowData.lastPrice);
		$row.find(".chg").text(rowData.chg);
		$row.find(".chgPer").text(rowData.chgPer);
		
		if(parseFloat(rowData.chg)>=0){
			$row.addClass("greencolor").removeClass("redcolor");
		}else{
			$row.addClass("redcolor").removeClass("greencolor");
		}
	},
	
	autoRefresh:function($refresh){
		var self=this;
		if($refresh.attr("checked")){
			this.timer=window.setInterval(function(){self.loadData()},this.interval);
		}else{
			window.clearInterval(this.timer);
		}
	},
	
	togglePic:function($toggle){
		$toggle.next().toggle();
	}
}